import { createApp,nextTick,h,render } from 'vue'
import message from '@/views/message/index.vue'
let mountNode
let app
// doubleDialog  是否需要二级弹窗
let createMount = (opts) => {
  if (mountNode && !opts.doubleDialog) {//确保只存在一个弹窗
    document.body.removeChild(mountNode)
    mountNode = null
  }
  mountNode = document.createElement('div')
  mountNode.className = 'message-draw'
  document.body.appendChild(mountNode)
  const vnode = h(message, {
    ...opts,
    remove() { //传入remove函数，组件内可移除dom 组件内通过props接收x
      document.body.removeChild(mountNode)
      mountNode = null
    },
  })
  vnode.appContext = app
  render(vnode, mountNode);
}
const messageBox = (options = { id: Number }) => {
  options.id = options.id || 'messageBox_' + new Date().getTime()
  createMount(options)
}
messageBox.remove = ()=>{
    if(mountNode){
      document.body.removeChild(mountNode)
      mountNode = null
    }
}
const messageModal = {
  install(Vue) {
    app = Vue._context
    Vue.config.globalProperties.$openMessage = messageBox;
  },
};
export default messageModal;